<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>案例分析</title>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="format-detection" content="telephone=no">
    <meta http-equiv="pragma" content="no-cache"> 
	<meta http-equiv="Cache-Control" content="no-cache, must-revalidate"> 
	<meta http-equiv="expires" content="0">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
    <meta http-equiv="keywords" name="keywords" content="" />
    <meta http-equiv="description" name="description" content="" />
    <link href="css/ydui.css" rel="stylesheet" />
<link href="https://cdn.bootcss.com/Swiper/4.3.0/css/swiper.min.css" rel="stylesheet">
<script src="js/ydui.flexible.js"></script>
	<link rel="stylesheet" type="text/css" href="css/all.css?v=201850002"/>
	<style type="text/css">
		.iconfont{
			font-size: .5rem!important;
		}
	</style>
</head>
	<body>
		<div class="g-flexview"  id="app" v-cloak>
       		<header class="m-navbar">
	            <div class="navbar-center">
	                <span class="navbar-title">{{dataresult.stageUnit.name}}</span>
	            </div>
        	</header>		
			<div class="g-scrollview">
				<ul class="m-grids-3">
		            <li class="grids-item"  v-on:click="changetype(1)">
		            	<a>
							<div class="grids-icon">
			                    <i class="iconfont icon-jiaoan1"></i>
			                </div>		            	
			                <div class="grids-txt">教案</div>
		                </a>
		            </li>
		            
		            <li class="grids-item"  v-on:click="changetype(2)">
						<div class="grids-icon">
		                    <i class="iconfont icon-shipin1"></i>
		                </div>			            	
		                <div class="grids-txt">视频</div>
		            </li>	            
		            <li class="grids-item"  v-on:click="changetype(3)">
						<div class="grids-icon">
		                    <i class="iconfont icon-zuoye"></i>
		                </div>			            	
		                <div class="grids-txt">作业</div>
		            </li>
		        </ul>		        
				<div v-for="el in dataresult.stageUnit.vplans" v-if="type==1">
			        <div class="coursecontent" v-if="el.type==1">
			        	<div class="jiaoan" v-html="el.content">  		
			        	</div>
			        </div>
					<div class="m-cell" v-if="el.type==2">
			            <a class="cell-item" v-bind:href="'pdf/web/viewer.html?pdf='+el.path">
			                <div class="cell-left">{{el.name}}.PDF</div>
			                <div class="cell-right cell-arrow"></div>
			            </a>
			        </div>						
				</div>	        
		        <div class="coursecontent" v-if="type==2">
					<article class="m-list list-theme3">
			            <a v-bind:href="'videoplayer.html?path='+el.path" class="list-item" v-for="el in dataresult.stageUnit.vvideos">
			                <div class="list-img">
			                    <img v-bind:src="el.thumbnailPath" >
			                </div>
			                <div class="list-mes">
			                    <h3 class="list-title">{{el.name}}</h3>
			                </div>
			            </a>			
			        </article>
		        </div>		
		        <div  v-if="type==3">
					<div  v-for="el in dataresult.stageUnit.vproblems">
						<div class="m-cell" v-if="el.type==2">
				            <div class="cell-item">
				                <div class="cell-left">{{el.question}}：</div>
								<div class="cell-right "></div>			          
				            </div>
							<label class="cell-item">
				                <span class="cell-left">A:{{el.optionA}}</span>
								<label class="cell-right">
				                    <input type="radio" value="A"  v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>		
							<label class="cell-item">
				                <span class="cell-left">B:{{el.optionB}}</span>
								<label class="cell-right">
				                    <input type="radio" value="B"  v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>	
							<label class="cell-item">
				                <span class="cell-left">C:{{el.optionC}}</span>
								<label class="cell-right">
				                    <input type="radio" value="C"  v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>	
							<label class="cell-item">
				                <span class="cell-left">D:{{el.optionD}}</span>
								<label class="cell-right">
				                    <input type="radio" value="D" v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>	
				            <div class="cell-item" v-if="dataresult.isCommitted">
				                <div class="cell-left">正确答案</div>
								<div class="cell-right ">{{el.correctAnswer}}</div>			          
				            </div>					            
				            <div class="cell-item" v-if="dataresult.isPublished">
				                <div class="cell-left">本题得分</div>
								<div class="cell-right ">{{el.problemScore}}</div>			          
				            </div>					            
				        </div>
						<div class="m-cell" v-if="el.type==3">
				            <div class="cell-item">
				                <div class="cell-left">{{el.question}}：</div>
								<div class="cell-right "></div>			          
				            </div>
							<label class="cell-item">
				                <span class="cell-left">A:{{el.optionA}}</span>
								<label class="cell-right">
				                    <input type="checkbox" value="A"  v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>		
							<label class="cell-item">
				                <span class="cell-left">B:{{el.optionB}}</span>
								<label class="cell-right">
				                    <input type="checkbox" value="B"  v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>	
							<label class="cell-item">
				                <span class="cell-left">C:{{el.optionC}}</span>
								<label class="cell-right">
				                    <input type="checkbox" value="C"  v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>	
							<label class="cell-item">
				                <span class="cell-left">D:{{el.optionD}}</span>
								<label class="cell-right">
				                    <input type="checkbox" value="D" v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>	
							<label class="cell-item" v-if="el.optionE!=''">
				                <span class="cell-left">E:{{el.optionE}}</span>
								<label class="cell-right">
				                    <input type="checkbox" value="E" v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>	
							<label class="cell-item" v-if="el.optionF!=''">
				                <span class="cell-left">F:{{el.optionF}}</span>
								<label class="cell-right">
				                    <input type="checkbox" value="F" v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>					            
				            <div class="cell-item" v-if="dataresult.isCommitted">
				                <div class="cell-left">正确答案</div>
								<div class="cell-right ">{{el.correctAnswer}}</div>			          
				            </div>					            
				            <div class="cell-item" v-if="dataresult.isPublished">
				                <div class="cell-left">本题得分</div>
								<div class="cell-right ">{{el.problemScore}}</div>			          
				            </div>					            
				        </div>
						<div class="m-cell" v-if="el.type==4">
				            <div class="cell-item">
				                <div class="cell-left">{{el.question}}：</div>
								<div class="cell-right "></div>			          
				            </div>
							<label class="cell-item">
				                <span class="cell-left">正确</span>
								<label class="cell-right">
				                    <input type="radio" value="1"  v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>		
							<label class="cell-item">
				                <span class="cell-left">错误</span>
								<label class="cell-right">
				                    <input type="radio" value="0"  v-model="el.answer">
				                    <i class="cell-radio-icon"></i>
				                </label>
				            </label>
				            <div class="cell-item" v-if="dataresult.isCommitted">
				                <div class="cell-left">正确答案</div>
								<div class="cell-right ">{{el.correctAnswer==0?'错误':'正确'}}</div>			          
				            </div>					            
				            <div class="cell-item" v-if="dataresult.isPublished">
				                <div class="cell-left">本题得分</div>
								<div class="cell-right ">{{el.problemScore}}</div>			          
				            </div>					            
				        </div>	
						<div class="m-cell" v-if="el.type==1">
				            <div class="cell-item">
				                <div class="cell-left">{{el.question}}</div>
								<div class="cell-right "></div>			          
				            </div>
							<div class="cell-item">
				                <div class="cell-right">
				                    <textarea class="cell-textarea" placeholder="请填写答案"  v-model="el.answer"></textarea>
				                </div>
				            </div>		
				            <div class="cell-item" v-if="dataresult.isPublished">
				                <div class="cell-left">本题得分</div>
								<div class="cell-right ">{{el.problemScore}}</div>			          
				            </div>					            
				        </div>							
					</div>	
					<div class="m-cell"  v-if="dataresult.isPublished">
			            <div class="cell-item">
			                <div class="cell-left">本节作业总得分</div>
							<div class="cell-right ">{{dataresult.unitScore}}</div>			          
			            </div>					            
			        </div>						
		        </div>		
		        
			</div>		
			<button type="button"  v-if="!dataresult.isCommitted" class="btn-block btn-warning" v-on:click="datajsonpost">作业提交</button>
		</div>
	</body>
    <script src="https://cdn.bootcss.com/jquery/2.2.0/jquery.min.js"></script>
	<script src="https://cdn.bootcss.com/Swiper/4.3.0/js/swiper.min.js"></script>
	<script src="js/ydui.js"></script>
    <script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.min.js"></script>
	<script src="js/all.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">

		var model= new Vue({
			el:'#app',
			data:{
				datainfo:localStorage.getItem('base'),
				dataresult:{},
				courseId:ComFunJS.getQueryString('courseId'),
				unitId:ComFunJS.getQueryString('unitId'),
				type:'1',
				answerJson:[]
			},
			methods:{
				fenxituzhimodel:function(sel){
					if(sel.drawingTypeId==1){
						localStorage.setItem('tuzhione',sel.content)
						window.location.href='tuzhi/tuzhione.html?'+'use=0';			
					}
					if(sel.drawingTypeId==2){
						localStorage.setItem('dianxing',sel.content)
						window.location.href='tuzhi/dianxing.html?'+'use=0';				
					}
					if(sel.drawingTypeId==3){
						localStorage.setItem('lantu',sel.content)
						window.location.href='tuzhi/lantu.html?'+'use=0';			
					}
					if(sel.drawingTypeId==4){
						localStorage.setItem('shangye',sel.content)
						window.location.href='tuzhi/shangye.html?'+'use=0';		
					}
					if(sel.drawingTypeId==5){						
						localStorage.setItem('yanjiang',sel.content)
						window.location.href='tuzhi/yanjiang.html?'+'use=0';			
					}
					if(sel.drawingTypeId==6){			
						localStorage.setItem('fenxi',sel.content)
						window.location.href='tuzhi/fenxi.html?'+'use=0';		
					}
					if(sel.drawingTypeId==7){			
						localStorage.setItem('Drawnaotu',sel.content)
						window.location.href='../../naotu/index.html?'+'use=0';				
					}			
				},					
				getinfo:function(){
					var _this =this
					ComFunJS.getJSON(ComFunJS.APIURL('/course/student/unit/listWithStageUnitCascade'),{courseId:_this.courseId,userId:ComFunJS.getCookie('userId'),unitId:_this.unitId,pageSize:5,pageNum:1},function(res){
						if(!res.error){
				    		$.each(res.list[0].stageUnit.vproblems, function(e,value) {
				    			value.courseId=_this.courseId;
				    			value.userId=ComFunJS.getCookie('userId');
				    			value.unitId=_this.unitId;
				    			if(res.list[0].unitProblems.length>0){
				    				$.each(res.list[0].unitProblems, function(i,result) {
										if(value.type==3){
					    					if(value.vproblemId==result.vproblemId){
					    						value.answer=result.answer.split(',');
					    						value.problemScore=result.problemScore;
					    						value.remark=value.remark
					    					}									
										}else{
					    					if(value.vproblemId==result.vproblemId){
					    						value.answer=result.answer;
					    						value.problemScore=result.problemScore;
					    						value.remark=value.remark
					    					}									
										}						
				    				});					    				
				    			}else{
										if(value.type==3){
					    						value.answer=[];
					    						value.problemScore='';
					    						value.remark=''
										}else{
					    						value.answer='';
					    						value.problemScore='';
					    						value.remark=''
										}					    				
				    			}		
				    		});	
				    		_this.dataresult=res.list[0];
				    		console.log(_this.dataresult)
						}else{
							window.location.href='login.html'
						}
					})
				},
			
				changetype:function(type){
					model.type=type;
				},
				datajsonpost:function(el){
					var _this=this;	
					ComFunJS.showConfirm('是否提交作业，作业提交之后不可修改，请仔细检查再确认提交','提示',function(){
						$.each(_this.dataresult.stageUnit.vproblems, function(i,res) {
							var oneswer={vproblemId:"",userId:"",courseId:"",answer:"",unitId:""}
							oneswer.vproblemId=res.vproblemId;
							oneswer.userId=res.userId;
							oneswer.courseId=res.courseId;
							if(res.type==3){
								oneswer.answer=res.answer.join(',');
							}else{
								oneswer.answer=res.answer;
							}
							oneswer.unitId=res.unitId;
							_this.answerJson.push(oneswer)
						});
						ComFunJS.putJSON(ComFunJS.APIURL('/course/student/unit/submit'),{
							'answerJson':JSON.stringify(_this.answerJson)
						},function(r){
							if(!r.error){
								ComFunJS.showMsg('提交成功','success');
								model.getinfo()
							}else{
								ComFunJS.showMsg(r.msg,'error')		            				
							}
						})						
					})

				}
			},
			mounted:function(){
				this.getinfo()
			}
		})
	</script>
</html>
